<template>
  <div style="padding: 40px">
    <xf-schema-form
      ref="schemaForm"
      :schema="schema"
      :ui-schema="uiSchema"
      :error-schema="errorSchema"
      :custom-formats="customFormats"
      :form-footer="formFooter"
      :form-props="formProps"
      :fallback-label="true"
      v-model="formData"
      @keyup.native.enter="handleSearch"
      @on-form-mounted="handleFormMounted"
      @on-change="handleDataChange"
      @on-cancel="handleCancel"
      @on-submit="handleSubmit"
    />
  </div>
</template>

<script>
  import { data1, data2, data3, data4, data5, data6 } from './data';
  export default {
    name: "Login",
    data() {
      return {
        schema: data6,
        formData: {},
        uiSchema: {},
        errorSchema:{},
        customFormats: null,
        formFooter: {
          show: true
        },
        formProps: {
          layoutColumn: 3,
          labelWidth: "100px",
          labelSuffix: null,
          isMiniDes: true
        }
      }
    },
    computed: {
    },
    methods: {
      handleFormMounted() {
        console.log('表单加载完成------', this.formData)
      },
      handleDataChange() {
        console.log('表单数据改变------', this.formData)
      },
      handleCancel() {
        console.log('表单提交取消------', this.formData)
      },
      handleSubmit() {
        console.log('表单确认提交------', this.formData)
      }
    },
  };
</script>
<style scoped>
</style>